<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>bad apple</title>
		<script type="text/javascript" src="BadAppleFrameReader.js"></script>
        <script type="text/javascript" src="index.js"></script>
		<style type="text/css">
			html {
				overflow: hidden;
			}
			body {
				overflow: auto;
				margin: 0;
			}
			#player-wrap {
				margin-left: auto;
				margin-right: auto;
				width: 512px;
			}
			#player {
				position: absolute;
				top: 50%;
				margin-top: -212px;
				width: 512px;
				border: 1px solid gray;
			}
			#title {
				height: 20px;
				background-color: gray;
				font-weight: bold;
				color: white;
			}
			#screen {
				height: 384px;
				background-color: black;
				position: relative;
			}
			#screen div {
				position: absolute;
				overflow: hidden;
				height: 4px;
			}
			#status {
				height: 20px;
				background-color: white;
			}
			.white {
				background-color: white;
			}
		</style>
    </head>
    <body>
    	<div id="player-wrap">
	    	<div id="player">
	    		<div id="title">Bad Apple!!</div>
	    		<div id="screen">
	    		</div>
	    		<div id="status"></div>
	    	</div>
		</div>
        <script type="text/javascript">
		setTimeout(function (){
        	bad_apple();
		}, 1000);
        </script>
    </body>
</html>
